<template>
	<view class="options">
		<block v-for="(item,index) in list" :key="index">
			<view class="item" @tap="itemClick(item)">
				<image :src="item.icon" class="img"></image>
				<view class="txt">{{item.name}}</view>
			</view>

		</block>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						name: '积分兑换',
						icon: require('@/static/index/jifen.png'),
						type:1,
						path:'/pages/tabbar/integral/integral'
					},
					{
						name: '限时秒杀',
						icon: require('@/static/index/miaosha.png'),
						path:'/pages/tabbar/index/seckillLst',
						type:2,
					},
					{
						name: '商城好券',
						icon: require('@/static/index/shop.png'),
						type:2,
						path:'/pages/mallCoupon/index/index',
					},
					{
						name: '邀请有礼',
						icon: require('@/static/index/yaoqing.png'),
						type:2,
						path:'/pages/promotion/promotion',
					}
				]
			}
		},
		methods: {
			itemClick(item){
				this.$emit('click',item)
			}
		}
	}
</script>
<style lang="scss" scoped>
	.options {
		height: 200rpx;
		background: #fff;
		display: flex;
		align-items: flex-end;
		justify-content:space-around;
		pointer-events: auto;
		padding-bottom: 40rpx;
		border-bottom-left-radius: 8rpx;
		border-bottom-right-radius: 8rpx;
		.item {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;

			.img {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
			}

			.txt {
				margin-top: 12rpx;
				font-size: 24rpx;
				font-weight: 400;
				color: rgba(0, 0, 0, 1);
			}
		}
	}
</style>
